var  currentWatcher ;
class Dep {
    constructor() {
        this.subs = [];
    }
    addSub(sub) {
        this.subs.push(sub);
    }
    notify() {
        this.subs.forEach(sub => sub.update());
    }
}
class Watcher {
    constructor(vm,expr,cb){
        this.vm = vm;//obj 观察的对象
        this.expr = expr;//"counter1" 观察的属性
        this.cb = cb;//值更新之后回调函数
        //给Dep这个类添加一个临时的静态属性，值指向当前的watcher实例
        Dep.target = this;
        //立刻访问了对象的属性 obj.counter1
        this.vm[this.expr];
        Dep.target = null;
    }
    update() {
        this.cb();
    }
}
let obj = {
    counter1:0,
    counter2:0,
    counter3:0
}
//遍历对象的每个属性
for (let key in obj) {
    //为对象的每个属性创建一个Dep类的实例，也就是一个可观察对象的实例
    const dep = new Dep();
    let value = obj[key];//value=0
    Object.defineProperty(obj, key, {
        get() {
            if(Dep.target){
                dep.addSub(Dep.target);
            }
            return value;
        },
        set(newVal) {
            if (newVal !== value) {
                value = newVal;
                dep.notify();
            }
        }
    });
}
//在编译模板的时候，如果遇到了{{counter1}}插件表达式，就需要添加依赖了，
//为counter1属性添加观察者了
//观察obj对象的counter1这个属性，当obj.counter1属性发生变化的时候，执行哪个回调函数
const watcher1 = new Watcher(obj,'counter1',()=>{
    console.log('观察者1号接收到通过啦,我要更新DOM了')
})
const watcher2 = new Watcher(obj,'counter1',()=>{
    console.log('观察者2号接收到通过啦,我要更新DOM了')
})
obj.counter1 = 1;